<template>
  <div class="pane">
    <template v-if="list.length>0">
      <div v-for="item in list" :key="item.id" class="lb">
        <div class="xinxi">
          <i>{{ item.title }}</i>
          <i>{{ item.add_time }}</i>
          <p>{{ item.content }}</p>
        </div>
      </div>
    </template>
    <div v-else class="wujilu">
      <i class="iconfont icon-zanwuyituichudingdan"></i>
      <p>{{ $t('您还没有信息') }}!</p>
    </div>
  </div>
</template>
<script>
import { mapActions } from 'vuex'
export default {
  data () {
    return {
      list: []
    }
  },
  beforeMount () {
    this.getMessageList()
  },
  methods: {
    ...mapActions({
      getMessage: 'user/getMessage'
    }),
    getMessageList () {
      const payload = {
        type: 1
      }
      this.getMessage(payload)
        .then(({ data }) => {
          this.list = data
        })
        .catch((data) => {})
    }
  }
}
</script>
<style scoped>
.wujilu {
  width: 100%;
  float: left;
  text-align: center;
  margin: 100px 0;
}
.wujilu i {
  font-size: 70px;
  color: #c5c9d5;
}
.wujilu p {
  color: #828fa2;
  line-height: 30px;
}
.pane {
  height: 100%;
  overflow-y: auto;
}
</style>
